<template>
  <view class="page_root" data-page-name="填报" data-page-identification="g_n0od6kf1vk">
    <!-- UNI_APP_EXEGESIS_START NAVIGATION_TEMPLATE UNI_APP_EXEGESIS_END -->
    <!-- begin vid_1xajtn371k 自定义模板_iqjjqf7218 -->
    <view class="body">
      <view class="content">
        <view class="bgc-img"></view>
        <view class="main" v-if="state.detailData.meetingQuestionList">
          <view
            class="action-item"
            v-for="(item, index) in state.detailData.meetingQuestionList"
            :key="item.id"
          >
            <view class="action-title">
              <view
                class="status"
                v-if="item.workOrderStatus === '未转化'"
                :style="{ backgroundColor: getStatusColor(item.workOrderStatus) }"
                >{{ '未转化工单' || '--' }}
              </view>
              <view
                class="status"
                v-else
                :style="{ backgroundColor: getStatusColor(item.workOrderStatus) }"
                >{{ item.workOrderStatus || '--' }}
              </view>
              <view class="base">
                <view>负责人：{{ item.responsiblePerson || '--' }}</view>
              </view>
            </view>
            <view class="action-content">
              <view class="odd-row">
                <view>问题&风险描述</view>
              </view>

              <view class="even-row">
                <view>{{ item.questionDescription || '--' }}</view>
              </view>
              <view class="odd-row">
                <view>解决方案及行动项</view>
              </view>

              <view class="even-row">
                <view>{{ item.solutionOrAction || '--' }}</view>
              </view>
              <view class="odd-row">
                <view>计划完成日期</view>
                <view>风险类型</view>
              </view>

              <view class="even-row">
                <view>{{ item.endTime || '--' }}</view>
                <view>{{ item.riskType || '--' }}</view>
              </view>
              <view class="odd-row">
                <view>项目类型</view>
                <view>区域</view>
              </view>

              <view class="even-row">
                <view>{{ item.projectType || '--' }}</view>
                <view>{{ item.areaName || '--' }}</view>
              </view>
              <view class="odd-row">
                <view>项目/工厂名称</view>
                <view>项目总监</view>
              </view>

              <view class="even-row">
                <view>{{ item.projectShortName || '--' }}</view>
                <view>{{ item.projectDirector || '--' }}</view>
              </view>
              <view class="odd-row">
                <view>项目经理</view>
                <view>PMO</view>
              </view>

              <view class="even-row">
                <view>{{ item.pmName || '--' }}</view>
                <view>{{ item.pmo || '--' }}</view>
              </view>

              <view class="odd-row">
                <view>完成情况反馈</view>
              </view>

              <view class="even-row">
                <view>{{ item.completionStatusFeedback || '--' }}</view>
              </view>
            </view>
          </view>
        </view>
      </view>
    </view>
    <!-- end vid_1xajtn371k 自定义模板_iqjjqf7218 -->
  </view>
</template>
    <script setup>
import {
  ref,
  reactive,
  toRaw,
  markRaw,
  watch,
  computed,
  onBeforeMount,
  onMounted,
  onBeforeUnmount,
  onUnmounted,
  onActivated,
  onDeactivated,
  getCurrentInstance,
} from 'vue';
import { useRoute } from 'vue-router';
const route = useRoute();
import { get, post, put, del, request, requestWithHeaders } from '@/utils/http/Axios';
// import { cloneDeep, localGet, traversalTreeStructure, set, checkCaseCondition, throttle, merge, debounce, getGridStyle, getCellRenderAble, formulaStrategy, getComponentParamsValue, get as lodashGet } from '@/utils/index';
// import { isEqual, isNullOrEmpty, isEmptyArr, isArray, isEmpty, isNullOrUnDef, isContained } from '@/utils/is';
// import { CovertOptions, getChartsDataSourceConvert } from '@/utils/chart';
// import { propertyFormatByNumber, propertyFormatByPercentage, propertyFormatByDate, parseSubFromDataList } from '@/utils/format';
// import { checkCommonCondition, getResultByCurrentCommonCondition } from '@/utils/formCondition';
// import { FormFormat } from '@/utils/formFormat'
import { customAddWaterMarkFunc, generateWaterMarkText } from '@/utils/addWaterMark';
// import dayjs from 'dayjs';
// import hashSum from 'hash-sum';
/*** UNI_APP_EXEGESIS ***
      import { handleRedirect, permission, parseJson } from '@/utils/common';
      import { onPullDownRefresh, onLoad, onReady, onShow, onHide, onPageScroll, onUnload } from '@dcloudio/uni-app';
      import { BroadcastMessage } from '@/utils/BroadcastMessage';
      import { sendToken } from "@/hooks/useIframeToken";
      *** UNI_APP_EXEGESIS ***/

// ---------------------------- 属性定义 ----------------------------
const sourceId = 'page3000000872';

// 获取传入的流程ID和组件参数
const props = defineProps({
  processInstanceId: {
    type: [String, Number, Boolean],
    default: undefined,
  },
  hideNav: {
    type: [Boolean],
    default: undefined,
  },
});

// 组件参数默认值
const componentParamsDefaultProps = {};

// 是否显示菜单按钮
const isMenuIconShow = false;
// NAVIGATION_MENU
const handleShowNavigation = () => {};

let isProcessState = ref(false);

const setTimeOutList = [];

const vid_1xajtn371k_props = reactive({
  code: '',
});

// ============================ 属性定义 ============================

// ---------------------------- 元素数据引用 ----------------------------
// 组件 自定义模板_iqjjqf7218 ref 的引用
const vid_1xajtn371k_ref = ref(null);
// 动态key的map
const fieldTypeMap = {};
// 动态key的map
const refMap = { vid_1xajtn371k_ref };

const showState = reactive({
  vid_1xajtn371k_visible: true,
});
// ============================ 元素数据引用 ============================

// ---------------------------- 数据 ----------------------------

// ============================ 数据 ============================

// ---------------------------- 方法 ----------------------------
// ---------------------------- 页面数据 ----------------------------

// ============================ 页面数据 ============================

// ---------------------------- 数据字典 ----------------------------

// ============================ 数据字典 ============================

// ---------------------------- 响应 ----------------------------

// ============================ 响应 ============================

// ---------------------------- 函数 ----------------------------

// 自定义函数 返回上一页
const customFunction_goBack_z5t6bmhb7z = (params) => {
  uni.navigateBack();
};

// ============================ 函数 ============================

// ---------------------------- 页面参数 ----------------------------

const pageParameter_state = reactive({
  processInstanceId: undefined,
});

// ============================ 页面参数 ============================

// ---------------------------- 组件事件处理方法 ----------------------------

// ============================ 组件事件处理方法 ============================

// ============================ 方法 ============================

// ---------------------------- 生命周期 ----------------------------
/*** UNI_APP_EXEGESIS ***
          // 获取上一层传递的数据
          const workflowChannel = new BroadcastMessage('WORKFLOW');
          workflowChannel.publish({ status: 'Ready' });
          workflowChannel.subscribe((data) => {
            if (data) {
              isProcessState.value = (window.self !== window.parent && data.type === 'hideHeader');
            }
          });
          *** UNI_APP_EXEGESIS ***/

const pageScrollTop = ref(0);

// *** PREVIEW_EXEGESIS ***
onMounted(() => {
  setPageParams(route.query);
  // 设置表单的rule
  try {
  } catch {
    // do nothing
  }
});
// *** PREVIEW_EXEGESIS *** //

/*** UNI_APP_EXEGESIS ***
      const routeOption = ref({})
      onLoad((option) => {
        routeOption.value = option;
      });
      onReady(() => {
        setPageParams(routeOption.value)
        // 设置表单的rule
        try{
    
        }catch{
            // do nothing
        }
      });
      // 图表刷新标记
      const uChartsReshowFlag = ref(false);
      onHide(() => { // 页面隐藏后标记置为false(如果不置为false无法触发图表更新)
          uChartsReshowFlag.value = false
      })
      onShow(() => {
          uChartsReshowFlag.value = true; // 页面激活后,标记置为true
    
          setPageParams(routeOption.value)
      })
      onPageScroll(e => {
          pageScrollTop.value = e.scrollTop
      });
      *** UNI_APP_EXEGESIS ***/

let setPageParams = (routerParam) => {
  const pageParams = [{ dataType: 'STRING', name: 'processInstanceId' }];
  const strategyMap = {
    STRING: (param, paramValue) => {
      pageParameter_state[param.name] = paramValue;
    },
    BOOLEAN: (param, paramValue) => {
      if ('true' === (paramValue || '').toLowerCase()) {
        pageParameter_state[param.name] = true;
      } else if ('false' === (paramValue || '').toLowerCase()) {
        pageParameter_state[param.name] = false;
      } else {
        // TODO: 是否要支持toast
        console.error('参数传入错误！类型不匹配！');
      }
    },
    NUMBER: (param, paramValue) => {
      if (!isNaN(paramValue)) {
        pageParameter_state[param.name] = Number(paramValue);
      } else {
        // TODO: 是否要支持toast
        console.error('参数传入错误！类型不匹配！');
      }
    },
    ARRAY: (param, paramValue) => {
      if (isNullOrUnDef(paramValue) || !paramValue || paramValue === 'undefined') {
        // default value
        pageParameter_state[param.name] = [];
      } else if (paramValue.trim().startsWith('[') && paramValue.trim().endsWith(']')) {
        try {
          pageParameter_state[param.name] = JSON.parse(decodeURI(paramValue));
        } catch (error) {
          console.error('参数解析失败 ', error);
        }
      } else {
        console.error('参数传入错误！类型不匹配！');
      }
    },
  };
  pageParams.forEach((param) => {
    strategyMap[param.dataType](param, routerParam[param.name]);
  });
};

onUnmounted(() => {
  // 销毁定时器
  setTimeOutList.forEach(({ repeat, timer }) => {
    repeat ? clearInterval(timer) : clearTimeout(timer);
  });
});

/*** UNI_APP_EXEGESIS ***
      onPullDownRefresh(() => {
        // 下拉刷新
        setTimeout(() => {
            uni.stopPullDownRefresh()
        }, 1000)
      })
      *** UNI_APP_EXEGESIS ***/

// ============================ 生命周期 ============================

// ---------------------------- 数据关联处理 ----------------------------
// ---------------------------- 组件数据同步 ----------------------------

// ============================ 组件数据同步 ============================
//
// ============================ 数据关联处理 ============================

// ---------------------- 不同组件自定义的处理逻辑 ---------------------

// ====================== 不同组件自定义的处理逻辑 ======================

// ================================定制化逻辑========================================
onMounted(() => {
  try {
    // recordForm?.value?.setRules(state.rules);
    let appDiv = document.querySelector('#app');
    appDiv.style.background = 'linear-gradient(180deg, #E1EFFD 100%, #ffffff 0%)';
    let topHeader = document.querySelector('.uni-page-head');
    if (topHeader) topHeader.remove();
    const queryString = window.location.search;

    // 使用 URLSearchParams 解析参数字符串
    const urlParams = new URLSearchParams(queryString);
    // 获取特定参数的值
    const id = urlParams.get('id');
    state.detailId = id;
    getData();
  } catch {
    // do nothing
  }
});
const state = reactive({
  detailId: undefined,
  detailData: {},
  videoPopupVisible: false,
  currentVideoUrl: '',
});
function getData() {
  get(`/solution-ppm/api/v2/built-in-system-ppm/meeting_minutes/${state.detailId}`).then((data) => {
    if (data.code !== 200) {
      uni.showToast({
        title: data.message,
        icon: 'error',
      });
      return;
    }
    state.detailData = data.data;
  });
}

const colorMap = {
  解决中: '#3875FF',
  未转化: '#9254DE',
  未开始: '#BBBBBB',
  待分发: '#FA8C16',
  已解决: '#52C41A',
  进行中: '#3875ff',
  未转化: '#BBBBBB',
  延期: '#F5222D',
  延期解决: '#FA8C16',
  无需解决: '#FFC900',
  已关闭: '#262626',
  已回访: '#9254DE',
  待分发: '#FF7D27',
};
function getStatusColor(status) {
  return colorMap[status] || '#BBBBBB';
}
</script>
    <style lang="less" scoped>
.page_root {
  min-height: 100%;
  box-sizing: border-box;
  overflow: auto;
}

.body {
  padding: 15px;
  padding-top: 0;
  background-color: linear-gradient(180deg, #e1effd 100%, #ffffff 0%);
  height: calc(100vh - 50px);
  overflow: auto;
  position: relative;
}
.main {
  box-shadow: 0 0 10px 0 #cfe7ff;
  border-radius: 6px;
  position: relative;
  top: 15px;
}

.bgc-img {
  position: absolute;
  width: 100%;
  height: 300px;
  left: 0;
  top: -248px;
  background-image: url('http://10.40.0.33:9001/file-storage/416680575854426112.png');
  background-size: cover;
}
.action-item {
  background: #ffffff;
  box-shadow: 0 0 10px 0 #cfe7ff;
  border-radius: 6px;
  margin-bottom: 15px;
}
.action-title {
  padding: 15px;
  display: flex;
  gap: 12px;
  align-items: center;
  border-bottom: 1px solid #d9d9d9;
}
.action-content {
  padding: 15px;
  display: flex;
  flex-direction: column;
  gap: 4px;
}
.base {
  display: flex;
  gap: 8px;
  font-size: 16px;
  color: #262626;
  text-align: center;
  font-weight: 500;
  align-items: center;
}
.status {
  padding: 4px 8px;
  font-size: 14px;
  color: #ffffff;
  letter-spacing: 0;
  text-align: center;
  font-weight: 500;
  text-align: center;
  height: 22px;
  border-radius: 2px;
  line-height: 14px;
  flex-shrink: 0;
}
.line {
  height: 14px;
  width: 1px;
  background-color: #262626;
}
.odd-row {
  font-size: 14px;
  color: #595959;
  font-weight: 400;
  display: flex;
  justify-content: space-between;
}
.even-row {
  font-size: 14px;
  color: #262626;
  font-weight: 600;
  display: flex;
  justify-content: space-between;
}
</style>
    